<!--
 * @Author: 胡海
 * @Date: 2020-11-22 16:19:47
 * @LastEditors: 胡海
 * @LastEditTime: 2020-11-22 16:30:39
 * @Description: 
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>声明式渲染</title>
    <script>
        var arr = [1,2,3,4];
        // 把数组中每一个属性X2，存在数组中

        // 命令式
        var newArr = [];
        for( var i = 0; i < arr.length; i++ ){
            newArr.push(arr[i]*2)
        }
        console.log(newArr);

        // 声明式
        let newArr2 = arr.map(item => item * 2);
        console.log(newArr2);
       /*声明式渲染理解
                1.DOM状态只是数据状态的一个映射
                2.所有的逻辑尽可能在状态的层面去进行
                3.当状态改变了，view会被框架自动更新到合理的状态
       */
    </script>
</head>
<body>
    
</body>
</html> 